<!-- 免疫记录，查看列表 -->
<template>
    <div>
        <el-drawer :model-value="isListShow" size="800px" :close-on-click-modal="false" :show-close="false" :close-on-press-escape="false">
            <template #header>
                <h4 style="font-weight: bold;">详情{{ seeId }}</h4>
            </template>
            <!-- 表格 -->
            <el-table :data="tableDate" stripe border style="width: 100%;">
                <el-table-column label="序号"  width="80px" type="index" />
                <el-table-column prop="cowCode" label="牛号" />
                <el-table-column prop="genderName" label="性别" />
                <el-table-column prop="breed" label="品种" />
            </el-table>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="cancelHandler">关闭</el-button>
                    <el-button type="primary" @click="addCompanyHandler">确认</el-button>
                </span>
            </template>
        </el-drawer>
    </div>
</template>

<script setup>
import { ref, onUpdated } from 'vue'
import { reqGetCowVaccinatioInfo } from '@/api/healthManage'

// 接收父组件传递过来的数据
let props = defineProps(['isListShow', 'seeId'])

// 注册自定义事件
let $emit = defineEmits(['closeSeeListDialog'])

// 获取表格数据
let tableDate = ref([])
const getCowVaccinatioInfo = async () => {
    let res = await reqGetCowVaccinatioInfo({
        id: props.seeId
    })
    if(res.status == 200){
        tableDate.value =  res.data.cowList
    }
}

// 关闭按钮
const cancelHandler = () => {
    $emit('closeSeeListDialog', false)
}

// 确认按钮
const addCompanyHandler = () => {
    $emit('closeSeeListDialog', false)
}

// 组件更新时
onUpdated(() => {
    getCowVaccinatioInfo()
})
</script>

<style scoped lang="scss"></style>